<%@ page import="com.itheima.domain.Student" %>
<%@ page import="java.util.List" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<!DOCTYPE html>
<!-- 网页使用的语言 -->
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>查询所有联系人</title>

    <!-- 1. 导入CSS的全局样式 -->
    <link href="../css/bootstrap.min.css" rel="stylesheet">
    <style type="text/css">
        tr, th {
            text-align: center;
        }
    </style>
</head>
<body>
<div class="container">
    <h2 class="text-center">联系人列表</h2>
    <%--提交给Servlet，使用get方法--%>
    <form action="list" method="get" class="form-inline" id="contactForm">
        <div class="row text-right" style="margin-bottom: 10px; margin-top: 15px;">
            <div class="col-md-4 text-left">
                <a class="btn btn-primary" style="width: 120px" href="../add.jsp">添加联系人</a>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <table border="1" class="table table-bordered table-hover">
                    <tr class="success">
                        <th>编号</th>
                        <th>姓名</th>
                        <th>性别</th>
                        <th>年龄</th>
                        <th>籍贯</th>
                        <th>QQ</th>
                        <th>邮箱</th>
                        <th>操作</th>
                    </tr>
                    <%--items要遍历的集合，var表示集合中每个元素
                    varStatus设置状态对象，
                    有4个属性：first, last, index, count
                    分页查询要遍历的是pageBean.data属性，这是封装了这一页数据的集合
                     --%>
                    <c:forEach items="${pageBean.data}" var="contact" varStatus="row">
                        <tr>
                                <%--
                                id是给程序员使用的，最终用户最好看到一个连续的编号
                                编号 1~5： count是1~5 ，size 是 5，current 是 1
                                编号 6~10： count是1~5 ，size 是 5，current 是 2
                                编号 11~15： count是1~5 ，size 是 5，current 是 3
                                --%>
                            <td>${row.count + (pageBean.current - 1) * pageBean.size}</td>
                            <td>${contact.name}</td>
                            <td>${contact.sex}</td>
                            <td>${contact.age}</td>
                            <td>${contact.address}</td>
                            <td>${contact.qq}</td>
                            <td>${contact.email}</td>
                            <td>
                                <div class="btn-group btn-group-sm">
                                        <%--点修改跳转到servlet中并且传递当前联系人的id做为参数--%>
                                    <a class="btn btn-success btn-xs"
                                       href="${pageContext.request.contextPath}/student/findById?id=${contact.id}">修改</a>&nbsp;
                                        <%--调用删除的servlet，如果这是一个链接，链接调用js代码的方法 javascript:js代码 --%>
                                    <a class="btn btn-info btn-xs"
                                       href="${pageContext.request.contextPath}/student/delete?id=${contact.id}">删除</a>
                                </div>
                            </td>
                        </tr>
                    </c:forEach>
                </table>
            </div>
        </div>

        <div class="row text-center">
            <div class="btn-group btn-group-sm">
                <%--调用一个JS的方法，进行页面跳转。方法提供2个参数：当前页，每页的大小--%>
                <a href="${pageContext.request.contextPath}/student/findAll" class="btn btn-default">首页</a>
                <c:if test="${pageBean.current>1}">
                    <a href="${pageContext.request.contextPath}/student/findAll?current=${pageBean.current-1}"
                       class="btn btn-default">上页</a>
                </c:if>

                <c:forEach begin="1" end="${pageBean.total}" var="i">
                    <a href="${pageContext.request.contextPath}/student/findAll?current=${i}"class="btn btn-default">${i}</a>
                </c:forEach>

                <c:if test="${pageBean.current<pageBean.total}">
                    <a href="${pageContext.request.contextPath}/student/findAll?current=${pageBean.current+1}"
                       class="btn btn-default">下页</a>
                </c:if>
                <a href="${pageContext.request.contextPath}/student/findAll?current=${pageBean.total}"
                   class="btn btn-default">末页</a>
            </div>

            共${pageBean.total}页 共${pageBean.count}条
        </div>
    </form>
</div>

</div>
</body>


</html>
